/* * Licensed to the Apache Software Foundation (ASF) under one or more * contributor license agreements. See the NOTICE file distributed with * this
work for additional information regarding copyright ownership. * The ASF licenses this file to You under the Apache License, Version 2.0 * (the
"License"); you may not use this file except in compliance with * the License. You may obtain a copy of the License at * *
http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is
distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific
language governing permissions and * limitations under the License. */
<template>
  <div class="list-model">
    <div class="table-box">
      <el-table
        :data="list"
        size="mini"
        style="width: 100%"
      >
        <el-table-column
          type="index"
          label="编号"
          width="50"
        ></el-table-column>
        <el-table-column
          prop="name"
          label="姓名"
        ></el-table-column>
        <el-table-column
          prop="tel"
          label="电话"
        ></el-table-column>
        <el-table-column
          prop="router"
          label="单位/学校"
        ></el-table-column>
        <el-table-column
          prop="applicationType"
          label="申请类型"
        ></el-table-column>
        <el-table-column
          prop="router"
          label="GPU型号"
        ></el-table-column>
        <el-table-column
          prop="count"
          label="GPU数量"
        ></el-table-column>
        <el-table-column
          label="申请时间"
          min-width="120"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.createTime  }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="审核时间"
          min-width="120"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.updateTime }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="status"
          label="申请状态"
        >
          <template slot-scope="scope">
            <span :class="{ 'text-success': scope.row.status === 1, 'text-danger': scope.row.status === 0 ,'text-warning': scope.row.status === 2}">{{
              scope.row.status===1 ? '申请成功' :scope.row.status===0? '申请失败':'申请中...'}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          width="100"
        >
          <template slot-scope="scope">
            <el-tooltip
              content="详情"
              placement="top"
            >
              <img
                src="../../../../operation/pages/index/_source/image/billing/detail.svg"
                @click="_detail(scope.row)"
              >
            </el-tooltip>
            <el-tooltip
              content="审核"
              placement="top"
            >
              <el-button
                type="primary"
                size="mini"
                icon="el-icon-user"
                circle
                @click="_check(scope.row)"
              ></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'application-list',
    data () {
      return {
        list: [],
      }
    },
    props: {
      environmentList: Array,
      pageNo: Number,
      pageSize: Number,
    },
    methods: {
      /* 详情 */
      _detail (item) {
        console.log('item', item)

        const { applicationType } = item
        this.$router.push({ name: 'application-details', query: { type: applicationType } })
      },
      // 审核
      _check (item) {
        this.$emit('on-check', item)
      },
    },
    watch: {
      environmentList (a) {
        this.list = []
        setTimeout(() => {
          this.list = a
        })
      },
    },
    created () {
      this.list = this.environmentList
    },
    mounted () { },
    components: {},
  }
</script>
<style lang="scss" scoped>
.text-warning {
  color: #f49149;
}
</style>
